<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../include/tag.jsp" %>
<%@ page import="com.party.core.model.system.TargetType" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>数据分析</title>
    <link rel="stylesheet" href="${ctx}/css/common/list.css">
    <link rel="stylesheet" href="${ctx}/css/common/table.css">
    <%@include file="../include/commonFile.jsp" %>
    <style type="text/css">
        .show-tips {
            cursor: pointer;
        }
    </style>
</head>
<body>
<!--头部-->
<%@include file="../include/header.jsp" %>
<div class="index-outside">
    <%@include file="../include/sidebar.jsp" %>
    <!--内容-->
    <section>
        <div class="section-main">
            <form class="layui-form" action="${ctx}/data/analyze/list.do" id="myForm" method="post">
                <input type="hidden" name="pageNo" id="pageNo"/>
                <div class="f-search-bar">
                    <div class="search-container">
                        <ul class="search-form-content">
                            <li class="form-item-inline"><label class="search-form-lable">功能<span class="f-verify-red">*</span></label>
                                <div class="layui-input-inline" style="margin-right: 20px">
                                    <select id="moduleCode" name="moduleCode" lay-search lay-verify="moduleCode" lay-filter="moduleCode">
                                        <option value="">请选择功能模块</option>
                                        <c:forEach var="module" items="${modules}">
                                            <option value="${module.code}" <c:if test="${module.code == input.moduleCode}">selected="selected"</c:if>>${module.value}</option>
                                        </c:forEach>
                                    </select>
                                </div>
                                <c:set var="mall" value="<%=TargetType.MALL.getCode()%>"/>
                                <div id="partnerDiv" class="layui-input-inline" style="${mall != input.moduleCode ? 'display: inline-block;' : 'display: none'}">
                                    合作商
                                    <div class="layui-input-inline">
                                        <select  id="partnerId" name="partnerId" lay-search lay-filter="partnerId">
                                            <option value="">全部合作商</option>
                                            <c:forEach var="partner" items="${partnerList}">
                                                <option value="${partner.id}" data-type="${partner.partnerType}" <c:if test="${partner.id == input.partnerId}">selected="selected"</c:if>>${partner.realname}</option>
                                            </c:forEach>
                                        </select>
                                    </div>
                                </div>
                                <c:set var="zc_activity" value="<%=TargetType.ZC_ACTIVITY.getCode()%>"/>
                                <div class="layui-input-inline" id="showOrNot" style="${zc_activity == input.moduleCode ? '' : 'display: none'}">
                                    <label class="" style="margin-left: 20px">合作商类型</label>
                                    <div class="layui-input-inline">
                                        <select id="partnerType" name="partnerType" lay-filter="partnerType">
                                            <option value="">全部</option>
                                            <option value="1" ${input.partnerType == 1 ? 'selected="selected"' : ''}>大客户</option>
                                            <option value="0" ${input.partnerType == 0 ? 'selected="selected"' : ''}>系统客户</option>
                                        </select>
                                    </div>
                                </div>
                            </li>
                        </ul>
                        <ul class="search-form-content">
                            <li class="form-item-inline"><label class="search-form-lable">日期<span class="f-verify-red">*</span></label>
                                <div class="layui-input-inline" style="width: 210px">
                                    <input class="layui-input" type="text" name="dateRange1" value="${input.dateRange1}"
                                           lay-filter="dateRange1" lay-verify="dateRange1" placeholder="选择日期">
                                </div>
                                对比
                                <div class="layui-input-inline" style="width: 210px">
                                    <input class="layui-input" type="text" name="dateRange2" value="${input.dateRange2}"
                                           lay-filter="dateRange2" lay-verify="dateRange2" placeholder="选择日期">
                                </div>
                            </li>
                            <li class="form-item-inline">
                                <div class="sub-btns" style="width: 262px; text-align: right;">
                                    <a class="layui-btn layui-btn-danger" lay-submit
                                       href="javascript:submitFunction('#myForm');">查询</a>
                                    <a class="layui-btn layui-btn-normal"
                                       href="javascript:resetFunction('#myForm');">重置</a>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </form>
            <div class="my-act-list-content">
                <ul id="view">
                    <c:if test="${not empty input.moduleCode}">
                        <table class="layui-table">
                            <colgroup>
                                <col width="20%">
                                <col width="20%">
                                <col width="20%">
                                <col width="20%">
                                <col width="20%">
                            </colgroup>
                            <thead>
                            <tr>
                                <th>${input.moduleValue}</th>
                                <th>${input.dateRange1}</th>
                                <th>${input.dateRange2}</th>
                                <th>对比结果(新增)</th>
                                <th>新增比率</th>
                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${list}" var="item">
                                <tr>
                                    <td>${item.name}<c:if test="${not empty item.introductions[0]}">&nbsp;&nbsp;<i class="icon iconfont show-tips" title="${item.introductions[0]}" onmouseover="txz.openQTip(this)">&#xe691;</i></c:if></td>
                                    <td>${item.result1}</td>
                                    <td>${item.result2}</td>
                                    <td>${item.addResult}</td>
                                    <td>${item.addRate}</td>
                                </tr>
                            </c:forEach>
                            </tbody>
                        </table>
                    </c:if>
                </ul>
            </div>
        </div>
    </section>
</div>

<script type="text/javascript" src="${ctx}/script/common/table_option.js"></script>
<script type="text/javascript" src="${ctx}/script/common/list.js"></script>
<script type="text/javascript">

    var form;

    $(function () {
        //加载日历
        layui.use(['laydate', 'form'], function () {
            var laydate = layui.laydate;
            form = layui.form;

            // 查询开始日期
            var start = {
                elem: 'input[name=dateRange1]',
                range: '到',
                done: function(value, date, endDate){

                }
            };

            var end = {
                elem: 'input[name=dateRange2]',
                range: '到',
                done: function(value, date, endDate){

                }
            };
            laydate.render(start);
            laydate.render(end);

            form.on('select(moduleCode)', function (data) {
                if ('<%=TargetType.ZC_ACTIVITY.getCode()%>' == data.value) {
                    $('#showOrNot').show();
                } else {
                    $('#showOrNot').hide();
                }
                if ('<%=TargetType.MALL.getCode()%>' == data.value) {
                    $('#partnerDiv').hide();
                } else {
                    $('#partnerDiv').show();
                }
            });

            form.on('select(partnerId)', function (data) {
                var val = data.value;
                var myval = $('#partnerId option[value='+val+']').data('type')
                if(val){
                    $('#partnerType').val(myval)
                    form.render('select');
                }
            });
            form.on('select(partnerType)', function (data) {
                var val = data.value;
                if(val){
                    $('#partnerId').val('')
                    form.render('select');
                }
            });
            form.verify({
                moduleCode: function (value) {
                    if (!value) {
                        return '请选择功能模块';
                    }
                },
                dateRange1: function (value) {
                    if (!value) {
                        return '请选择日期';
                    }
                },
                dateRange2: function (value) {
                    if (!value) {
                        return '请选择日期';
                    }
                }
            });
        });
    })
</script>
<script type="text/javascript">
    txz.initHeader({
        nav: [{
            name: '数据分析',
            curr: true
        }]
    });
</script>
</body>
</html>